﻿@using PMS.Web.FrontUI
@using PMS.Web.Models.Customers
@model OnlineCustomerModel
@{
    Layout = "_AdminHomeLayout";
    int ModuleId = (int)ViewBag.ModuleId;
    OnlineCustomerSearchModel searchModel = ViewBag.SearchModel as OnlineCustomerSearchModel ?? null;
}

<div class="layui-card">
    <div class="layui-card-body">
        <table id="pms-table" lay-filter="pms-table"></table>
    </div>
</div>

<input type="text" id="gridPageSize" value="@searchModel.AvailablePageSizes" class="layui-hide" />

@section Scripts{
    <script type="text/javascript">
        layui.use(['table', 'jquery', 'element', 'Cookies', 'http'], function () {
            let table = layui.table;
            let $ = layui.jquery;
            let element = layui.element;
            let Cookies = layui.Cookies;
            let http = layui.http;

            var getAuthToken = function () {
                const cookieVal = Cookies.get(".PMS.SignInToken");
                return cookieVal != null ? "Bearer " + cookieVal : "";
            };

            let availabePageSize = PMSUtils.parseToIntegerArray($("#gridPageSize").val());
            var tableConfig = {
                id: 'pms-table',
                elem: '#pms-table',
                method: 'post',
                contentType: 'application/json;charset=UTF-8',
                url: backendwebapiConfig.loadonlinecustomerpagedlist,
                request: {
                    pageName: '@searchModel.NameOf(p => p.Page)', //页码的参数名称，默认：page
                    limitName: '@searchModel.NameOf(p => p.PageSize)' //每页数据量的参数名，默认：limit
                },
                headers: null,
                limits: availabePageSize,
                limit:  @searchModel.PageSize,
                skin: 'line',
                defaultToolbar: [{
                    layEvent: 'refresh',
                    icon: 'layui-icon-refresh',
                    title: '刷新'
                }, 'filter', 'print', 'exports'],
                page: {
                    curr: 1
                },
                cols: [
                    [
                        { type: "numbers", width: 50, fixed: 'left', align: 'center' },
                        { field: 'Id', hide: true, title: 'ID' },
                        { field: '@Model.NameOf(p => p.CustomerInfo)', title: '@Model.DisplayName(m => m.CustomerInfo)', width: 220 },
                        { field: '@Model.NameOf(p => p.RegisteredInStore)', title: '@Model.DisplayName(m => m.RegisteredInStore)', width: 180 },
                        { field: '@Model.NameOf(p => p.LastIpAddress)', title: '@Model.DisplayName(m => m.LastIpAddress)', width: 150 },
                        { field: '@Model.NameOf(p => p.LastActivityDate)', title: '@Model.DisplayName(m => m.LastActivityDate)', minWidth: 80},
                        { field: '@Model.NameOf(p => p.LastVisitedPage)', title: '@Model.DisplayName(m => m.LastVisitedPage)', minWidth: 160}
                    ]
                ],
                error: function (e, msg) {
                    if (e.status === 401) { //UnAuthorized
                        var Error401 = http.ajax.defaultError401;
                        if (error.responseJSON) {
                            if (error.responseJSON.error !== undefined) {
                                Error401 = {
                                    message: error.responseJSON.error,
                                    details: error.responseJSON.error_description
                                };
                            }
                        }
                        http.ajax.showError(Error401);
                    }
                },
                parseData: function (res) {
                    return {
                        "code": res.state == 200 ? 0 : -1,     //解析接口状态
                        "msg": res.state == 200 ? "" : res.message,     //解析提示文本
                        "count": res.state == 200 ? res.data.RecordsTotal : 0, //解析数据长度
                        "data": res.state == 200 ? res.data.Data : null,   //解析数据列表
                    };
                }
            };

            var authToken = getAuthToken();
            if (authToken.length > 0) {
                tableConfig.headers = { 'Authorization': authToken };
            }
            var tableIns = table.render(tableConfig);
           
            table.on('toolbar(pms-table)', function (obj) {
                if (obj.event === 'refresh') {
                    window.location.reload(true);
                    return;
                }
            });
        });
    </script>
}
